<?xml version='1.0' encoding='UTF-8'?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <h:form id="frmTitle">
        <p:growl id="msgs" showDetail="false"/>
        <h:panelGrid columns="2" cellpadding="1">
            <h:outputText value="#{msgs.solicitacaoTitulo}" styleClass="fontTitle"/>
        </h:panelGrid>
    </h:form>

    <h:form id="frmNew">

        <p:fieldset legend="#{msgs.lgdNovo}">

            <h:panelGrid columns="2" id="pngNew">    

                <p:outputLabel for="lblDescricao" value="#{msgs.descricao}"/>
                <h:panelGrid columns="2">     
                    <p:inputText id="lblDescricao" value="#{modeloSolicitacaoNewMB.descricao}" size="45"/>
                </h:panelGrid>

                <h:outputText value="#{msgs.etapa}"/>
                <h:panelGrid columns="2" id="pngEtapa">  
                    <p:commandButton id="btnBuscarEtapa" onclick="dlgEtapa.show()" icon="ui-icon ui-icon-plus"/>
                </h:panelGrid>

                <h:panelGrid columns="2">
                    <p:commandButton id="btnSalvar" value="#{msgs.salvar}" action="#{modeloSolicitacaoNewMB.salvar}" ajax="false"/>
                    <p:commandButton id="btnVoltar" value="#{msgs.voltar}" action="#{modeloSolicitacaoNewMB.voltar}" ajax="false"/> 
                </h:panelGrid>
            </h:panelGrid>

        </p:fieldset>
    </h:form>

    <p:dialog header="Adicionar Etapas" widgetVar="dlgEtapa" width="750" resizable="false" modal="true" styleClass="styleDialog">
        <h:form>

            <p:fieldset legend="Adicionar Etapas">

                <h:panelGrid columns="3" cellpadding="5"> 

                    <h:outputLabel value="Adicionar Etapa" for="basicPojo"/>  
                    <p:autoComplete value="#{modeloSolicitacaoNewMB.etapaselecionada}" id="basicPojo" completeMethod="#{modeloSolicitacaoNewMB.completeEtapa}"  
                                    var="e" itemLabel="#{e.descricao}" itemValue="#{e}" converter="etapaConverter"/>  
                  
                    <p:commandButton value="Adicionar" update=":frmEtapas" actionListener="#{modeloSolicitacaoNewMB.adicionarEtapa()}"/> 
                 
                </h:panelGrid>

            </p:fieldset>

        </h:form>

        <h:form id="frmEtapas">

            <p:fieldset legend="Etapas">

                <h:panelGrid columns="1" width="100%">

                    <p:dataTable id="tblEtapa" var="tbl" value="#{modeloSolicitacaoNewMB.lsetapa}" rows="5" paginator="true"
                                 emptyMessage="#{msgs.msgTabelaVazia}" paginatorPosition="bottom">  

                        <f:facet name="header">
                            <h:outputText value="#{msgs.etapaTblTitulo}"/>                    
                        </f:facet>

                        <p:column>
                            <f:facet name="header">
                                <h:outputText value="#{msgs.descricao}"/>
                            </f:facet>
                            <h:outputText value="#{tbl.descricao}"/>
                        </p:column>

                        <p:column>
                            <p:commandButton id="btnRemoverEtapa" actionListener="#{modeloSolicitacaoNewMB.removerEtapa(tbl)}" rendered="#{modeloSolicitacaoNewMB.lsetapa.size() > 0}" icon="ui-icon ui-icon-close" update=":frmEtapas" />   
                        </p:column>

                    </p:dataTable>  

                    <h:panelGrid>
                        <p:commandButton id="btnFechar" value="#{msgs.btnFechar}" onclick="dlgEtapa.hide()" style="width:90px;margin-bottom: 20px;" styleClass="centerButton"/>
                    </h:panelGrid>

                </h:panelGrid>

            </p:fieldset>

        </h:form>

    </p:dialog>

</html>

